<template>
  <div>
    <el-radio
        v-for="type in makeTypeList" v-bind:key="type.id"
        v-model="makeType" :label="type.id" @change="updateMakeType">
      {{ type.description }}
    </el-radio>
    <br/>
  </div>
</template>

<script>
export default {
  name: "MakeType",
  props: ['modelName'],
  mounted() {
    // this.updateMakeType(this.makeType)
  },
  data() {
    return {
      makeType: this.$store.state.model.modelSettingList[this.modelName]['make_type'],
    }
  },
  methods: {
    getModelDetail: function () {
      let detailList = this.$store.state.model.modelDetailList
      for (let m of detailList) {
        if (m.name === this.modelName) {
          return m
        }
      }
      return null
    },
    updateMakeType(mt) {
      this.$store.commit(
          'updateMakeType',
          {
            model: this.modelName,
            makeType: mt
          }
      )
    },
  },
  computed: {
    makeTypeList: function () {
      let detail = this.getModelDetail()
      let typeList = []
      for (let tp of detail.make_type_list) {
        for (let t of this.$store.state.model.makeTypeList) {
          if (t.id === tp) {
            typeList.push(t)
            break
          }
        }
      }
      return typeList
    },
  }
}
</script>

<style scoped>

</style>